<template>
    <header class="head-nav">

        <div class="l-content">
            <!-- <el-button type="primary" icon="el-icon-menu" size="mini" class="el-button"></el-button> -->
            <!-- <el-breadcrumb separator="/">
                <el-breadcrumb-item>首页</el-breadcrumb-item>
                <el-breadcrumb-item><a href="/">活动管理</a></el-breadcrumb-item>

            </el-breadcrumb> -->
            <p class="content">宠宠爱后台管理系统</p>
        </div>
        <div class="r-content">
            <el-dropdown trigger="click">
                <span class="el-dropdown-link">
                    <img :src="userImg" class="user">
                </span>
                <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item>个人中心</el-dropdown-item>
                    <el-dropdown-item @click.native="adout">退出</el-dropdown-item>

                </el-dropdown-menu>
            </el-dropdown>
        </div>
    </header>
</template>

<script>

export default {

data() {
    return {
        userImg: require('../assets/images/1.png')
    }
},
methods:{
    adout(){
        localStorage.removeItem('aId'); 
        alert("确定离开");
        console.log("adout");
        // console.log(aId);
        this.$router.push('adlog')
    }
}
}
</script>
<style scoped>
    header {
        display: flex;
        width: 100%;
        height: 71px;
        min-width: 600px;
        /* padding: 5px; */
        align-items: center;
        color: aliceblue;
        background-color: #324057;
        justify-content: space-between;
        font-family: 隶书;
        font-size: xx-large;
    }

    .el-dropdown-link {
        color: #fff;
    }

    .user {
        width: 50px;
        height: 50px;
        border-radius: 50%;
    }

    .l-content {
        display: flex;
        align-items: center;

    }

    .el-button {
        margin-right: 20px;
    }
</style>
<style>
    .el-breadcrumb__inner {
        color: #fff;
    }

    .el-breadcrumb__inner a,
    .el-breadcrumb__inner.is-link {
        font-weight: 700;
        text-decoration: none;
        transition: color .2s cubic-bezier(.645, .045, .355, 1);
        color: #fff;
    }

    .el-breadcrumb__item:last-child .el-breadcrumb__inner,
    .el-breadcrumb__item:last-child .el-breadcrumb__inner a,
    .el-breadcrumb__item:last-child .el-breadcrumb__inner a:hover,
    .el-breadcrumb__item:last-child .el-breadcrumb__inner:hover {
        font-weight: 400;
        color: #fff;
        cursor: text;
    }

    body {
        margin: 0;
    }
</style>